import React, { useRef } from 'react'
import Test from './Test'

// 需求：获取 DOM
export default function App () {
  // #1 创建 ref 对象
  const testCmpRef = useRef(null) // 每次渲染得到的是同一个 ref 引用
  // const inputRef = React.createRef() // 每次渲染每次得到都是全新的 ref 引用
  const handleClick = () => {
    // #3 inputRef.current 就表示关联到的 DOM 对象
    testCmpRef.current.changeCount(8)
  }
  return (
    <div>
      {/* //!#2 把创建出来的 testCmpRef 和 ref 属性进行关联 */}
      <Test ref={testCmpRef} />
      <button onClick={handleClick}>click</button>
    </div>
  )
}